<template>
  <el-radio-group style="padding-top: 8px" v-model="name"  text-color="black" fill="#42b983" @change="handleSetCategory">
    <el-radio-button label="ALL" border>全部设备</el-radio-button>
    <el-radio-button label="CS">超声波</el-radio-button>
    <el-radio-button label="ZN">智能表</el-radio-button>
  </el-radio-group>
</template>

<script>
export default {
  name: 'CategorySelect',
  data() {
    return {
      categoryOptions: [
        { label: '全部设备', value: 'ALL' },
        { label: '超声波', value: 'CS' },
        { label: '智能表', value: 'ZN' }
      ],
      name:'ALL'
    }
  },
  created() {
    this.name = this.$store.getters.deviceCategory
  },
  methods: {
    handleSetCategory() {
      this.$store.dispatch('app/setCategory', this.name)
      this.refreshView()
    },
    refreshView() {
      // In order to make the cached page re-rendered
      this.$store.dispatch('tagsView/delAllCachedViews', this.$route)

      const { fullPath } = this.$route

      this.$nextTick(() => {
        this.$router.replace({
          path: '/redirect' + fullPath
        })
      })
    }
  }

}
</script>
